import { getCurrentInstance } from 'vue';

// Vuetify
import * as directives from 'vuetify/directives';
import * as components from 'vuetify/components';
import {createVuetify, ThemeDefinition} from 'vuetify';

// Styles
import '@mdi/font/css/materialdesignicons.css';
import 'vuetify/styles';

// Misc
import { loadFonts } from './webfontloader';

loadFonts();

const customLightTheme: ThemeDefinition = {
  dark: false,
  colors: {
    primary: '#9155fd',
    secondary: '#8a8d93',
    accent: '#0d6efd',
    error: '#ff4c51',
    info: '#16b1ff',
    success: '#56ca00',
    warning: '#ffb400',
  }
}

export default createVuetify({
  // https://next.vuetifyjs.com/en/getting-started/installation/
  components,
  directives,
  theme: {
    defaultTheme: 'customLightTheme',
    themes: {
      customLightTheme,
    }
  }
});

/** Get vuetify instance (For Composition api) */
export function useVuetify() {
  /** Get Instance */
  const instance = getCurrentInstance();
  if (!instance) {
    throw new Error(`Should be used in setup().`);
  }
  // @ts-ignore
  return instance.proxy.$vuetify;
}
